<template>
  <div class="button-box">
    <div class="btn" v-if="isOk == '0'">
      <!-- <img :src="require('@/assets/recognize.png')" @click="handleClick" /> -->
      <div class="text">请在光线充足地方进行</div>
    </div>
    <div class="btn" v-else-if="isOk == '1'">
      <!-- <img :src="require('@/assets/recognize-success.png')" /> -->
      <div class="text">恭喜您，人脸识别成功，您已完成配偶数据授权！</div>
    </div>
    <div class="btn" v-else>
      <!-- <img :src="require('@/assets/recognize-fail.png')" /> -->
      <div class="text">很抱歉，人脸识别失败，请重新验证！</div>
      <ul class="describe">
        <li><span></span>确保本人面部出现在框内</li>
        <li><span></span>确保面部与屏幕保持适当距离</li>
        <li><span></span>保持光线充足和均匀</li>
        <li><span></span>摘掉眼镜并露出耳朵</li>
      </ul>
      <div class="footer-btn">
        <x-button action-type="button" plain @click.native="handleClick">重 新 验 证</x-button>
      </div>
    </div>
    <!-- <x-button action-type="button" type="primary" @click.native="change">切换页面</x-button> -->
    
  </div>
</template>

<script>
  import wx from "weixin-js-sdk";
  import md5 from "js-md5";
  import Vue from 'vue';
import { Button } from 'vant';



Vue.use(Button)

  export default {
    name: "gzFaceVerification",
    props: {
      stateFlag:{
       type:String,
       default:''
      },
      identityinfo: {
        //配置用户名 身份证号码
        type: Object,
        default: {},
      },
      triggerMode: {
        type: String,
        default: "auto", // auto 为自动触发人脸识别，click 为需要点击触发
      },
      value: 0,
    },
    data() {
      return {

        instId:'',
        faceResults:'',
        latestUrl: "",
        isOk: this.value ? Number(this.value) : 0,
        isDisable: false,
        schema: "",
        bizToken: '',
      };
    },
    created() {},
    mounted() {
      this.instId = this.getParam('instId')
      //  this.baseService
      //               .postForm(this.__ctx + "/cifPer/exp/queryRes", {instId:this.instId})
      //               .then((res) => {
      //                if (res.isOk) {
                    
      //                 this.faceResults = res.data.faceResults
      //                 if (this.faceResults) {
      //                   this.isOk = this.faceResults
      //                 }else{
                        
      //                     this.handleClick()
      //                  }
      //                }
      //               })
                  
      
      //获取UA信息
      let ua = this.$bridge.getDeviceType();
      this.schema = ua;
      // if (ua.indexOf("rdsgzapp/android") != -1) {
      //   this.schema = "android";
      //   // 接收调用原生人脸识别后返回的信息
      //   window.callBackLiveParam = (faceInfo) => {
      //     // 返回数据事例
      //     // {"message":"动作活体检测耗时:695 攻击类型:1","code":0,"success":true,"data":{"code":1}}
      //     if (faceInfo.success) {
      //       this.isOk = 1;
      //     } else {
      //       this.isOk = 2;
      //     }
      //     let info = {
      //       ErrMsg: faceInfo.message,
      //       ErrCode: faceInfo.code,
      //     };
      //     this.$emit("getverification", info);
      //     this.$emit("input", this.isOk == 1 ? true : false);
      //   };
      // } else if (ua.indexOf("rdsgzapp/ios") != -1) {
      //   this.schema = "ios";
      // } else {
      let bizToken = this.getParam('BizToken')
      if (bizToken) {
        this.bizToken = bizToken
        this.getVerificationInfo(this.bizToken, this.instId, this.identityinfo.fileType);
      }
      // else {
      //   let isOk = this.value ? Number(this.value) : 0;
      //   if (this.triggerMode == "auto" && isOk == 0) {
      //     this.handleClick();
      //   }
      // }
    },
    methods: {
     
      change() {
        if (this.isOk == 2) {
          this.isOk = 0;
        } else {
          this.isOk++;
        }
      },
      getParam(name) {
        var locUrl = window.location.search.substr(1);
        var aryParams = locUrl.split("&");
        var rtn = "";
        for (var i = 0; i < aryParams.length; i++) {
          var pair = aryParams[i];
          var aryEnt = pair.split("=");
          var key = aryEnt[0];
          var val = aryEnt[1];
          if (key != name) continue;
          if (rtn == "") {
            rtn = val;
          } else {
            rtn += "," + val;
          }
        }
        return rtn;
      },
      getHidestr(str, type) {
        let newStr = ''
        if (str === 0 || str) {
          str += ''
          if (type == 'idCard') { //身份证类型  隐藏证件号中间的月日
            newStr += str.substr(0, 6)
            for (let i = 6; i < str.length; i++) {
              newStr += '*'
            }
          } else if (type == 'nameself') { //本人姓名
            if (str.length <= 3) { //小于三位 隐藏名
              newStr += str.substring(0, 1)
              for (let i = 1; i < str.length; i++) {
                newStr += '*'
              }
            } else { //大于三位 显示前2位 其余隐藏
              newStr += str.substring(0, 2)
              for (let i = 2; i < str.length; i++) {
                newStr += '*'
              }
            }
          } else {
            newStr = str
          }
        }
        return newStr
      },
      getAppResult(base64) {
        return new Promise((resolve, reject) => {
          this.baseService
            .post(this.__ctx + "/UAP/uap6026106", {
              name: this.identityinfo.name,
              idCard: this.identityinfo.idCard,
              idCardType: "101",
              instId: this.instId,
              fileType: this.identityinfo.fileType,
              face: base64.FileDataOne,
              video: base64.LivenessData,
            })
            .then((res) => {
             
              resolve(res);
            })
            .catch((err) => {
              reject(err);
            });
        });
      },
      handleClick() {
        //开始进行人脸验证
        let winhref = window.location.href;
        let bizToken = this.getParam('BizToken')
        if (bizToken) {
          this.latestUrl = winhref.substring(
            0,
            winhref.indexOf("BizToken") - 1
          );
        } else {
          this.latestUrl = winhref;
        }
        let url = this.__ctx + "/tencentCloud/face/getBakTencentBizToken";
        let config = {
          redirectUrl: this.latestUrl || '',
          idCard: this.identityinfo.idCard || "",
          name: this.identityinfo.name || "",
        };
        if (this.isDisable) {
          return false;
        }
        this.isDisable = true;
        // window.open('https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx1f7125112b74db52&redirect_uri=https%3A%2F%2Fopen.faceid.qq.com%2Fv1%2Fapi%2FgetCode%3FbizRedirect%3Dhttps%253A%252F%252Ffaceid.qq.com%252Fapi%252Fauth%252FgetOpenidAndSaveToken%253Ftoken%253DF8003CCB-2352-4DAF-A94F-37CFCB927CCF&response_type=code&scope=snsapi_base&state=&component_appid=wx9802ee81e68d6dee#wechat_redirect','_self')
        // return false
        this.baseService
          .postForm(url, config)
          .then((res) => {
            this.isDisable = false;
            if (res.isOk) {
              let openUrl = res.data.url;
              window.open(openUrl, "_self");

            } else {
              this.abTools.toast("请求失败，请稍后再试！", "warn");
            }
          })
          .catch((err) => {
            this.isDisable = false
            this.abTools.toast("数据不正确，请求失败，请稍后再试！", "warn");
          })
      },
      saveResult () {
        this.baseService
              .postForm(this.__ctx + "/cifPer/exp/saveFaceRes", {instId:this.instId,faceResults: this.isOk})
              .then((res) => {
              })
      },
      getVerificationInfo(bizToken, instId, filetype) {
        //、获取人脸验证结果
        let url = this.__ctx + "/tencentCloud/face/getBakDetectInfo";
        let config = {
          bizToken: bizToken,
          instId: instId,
          fileType: filetype
        };
        this.baseService
          .postForm(url, config)
          .then((res) => {
            if (res.isOk) {
              if (res.data.Text.ErrCode === 0) {
                this.isOk = 1;
              } else {
                this.isOk = 2;
              }
              this.$emit("input", this.isOk)
              this.saveResult()
            }
          })
          .catch((err) => {});
      },
    },
    watch: {
      value(newValue, oldValue) {
        this.isOk = newValue;
      },
      identityinfo(val) {
        if (this.bizToken) {
          this.getVerificationInfo(this.bizToken, this.instId, this.identityinfo.fileType)
        }
      }
    },
  };
</script>

<style lang="less" scoped>
.van-button--block{
  position: fixed;
  bottom: 0;
  left: 0;
  background-color: rgb(204, 52, 0);
  border: none;

}
  .button-box {
    text-align: center;
    padding: 2.6rem 1rem;

    .btn {
      display: inline-block;
      position: relative;

      .text {
        color: #4e5969;
        font-size: 1.6rem;
        padding: 1.2rem 0;
      }

      .describe {
        text-align: left;
        color: #4e5969;
        font-size: 1.4rem;
        padding: 1.2rem 0;

        li {
          padding: 0.2rem;

          span {
            display: inline-block;
            width: 0.8rem;
            height: 0.8rem;
            border-radius: 50%;
            background-color: #3f7ad6;
            margin-right: 1rem;
          }
        }
      }

      .footer-btn {
        padding: 1.8rem 1rem;

        .weui-btn {
          height: 4rem;
          border-radius: 2rem;
          color: #ff4a32;
          border-color: #ff4a32;
        }
      }
    }
  }
</style>
